<template>
	<view class="addcard">
		<u-navbar :title-bold="true" title="添加健康卡"></u-navbar>
		<view class="head">
			<view class="headl">
				扫描 <span>身份证</span> 自动填充就诊人信息
			</view>
			<view class="headr" @click="chooseimg()">
				<view class="icon">
					<image src="../../../static/icons/xiangji.png" mode=""></image>
				</view>
				<view class="title">
					去扫描
				</view>
			</view>
		</view>
		<view class="form">
			<view class="formtitle">
				<view class="line">

				</view>
				<view class="info">
					个人信息
				</view>
			</view>
			<view class="name">
				<view class="namel">
					姓名
				</view>
				<view class="namer">
					<input type="text" v-model="name" value="" placeholder="请输入持卡人的姓名" />
				</view>
			</view>
			<!-- <view class="name">
				<view class="namel">
					性别
				</view>
				<view class="namer" style="padding-top: 20rpx;">
					<u-radio-group v-model="value" >
						<u-radio @change="radioChange" v-for="(item, index) in sexlist" :key="index" :name="item.name" :disabled="item.disabled">
							{{item.name}}
						</u-radio>
					</u-radio-group>
				</view>
			</view> -->
			<view class="cardtype">
				<view class="cardtypel">
					证件类型
				</view>
				<view class="cardtyper" @click="choosercardtype()">
					{{cardtype}}
				</view>
			</view>
			<view class="name">
				<view class="namel">
					证件号
				</view>
				<view class="namer">
					<input type="text" v-model="cardid" value="" placeholder="请输入证件号" />
				</view>
			</view>
			<!-- <view class="name">
				<view class="namel">
					性别
				</view>
				<view class="namer">
					<input type="text" disabled="true"  v-model="sex" value="" placeholder="根据身份证号自动填充" />
				</view>
			</view>
			<view class="name">
				<view class="namel">
					出生年月
				</view>
				<view class="namer">
					<input type="text" disabled="true"  v-model="bir" value="" placeholder="根据身份证号自动填充" />
				</view>
			</view> -->
			<view class="cardtype">
				<view class="cardtypel">
					民族
				</view>
				<view class="cardtyper" @click="chooseminzutype()">
					{{minzu}}
				</view>
			</view>
			<view class="name">
				<view class="namel">
					详细地址
				</view>
				<view class="namer">
					<input type="text" style="width: 500rpx;" v-model="address" value="" placeholder="请输入详细地址" />
				</view>
			</view>
			<view class="name">
				<view class="namel">
					手机
				</view>
				<view class="namer">
					<input type="text" v-model="phone" value="" placeholder="请输入手机号" />
				</view>
			</view>
			<!-- <view class="name">
				<view class="namel">
					验证码
				</view>
				<view class="namer">
					<input type="text" v-model="ma" value="" placeholder="请输入手机号" />
				</view>
			</view> -->
		</view>
		<view class="foot">
			<view class="btn" @click="submit()">
				添加健康卡
			</view>
			<view class="shouquan" @click="shouquan()">
				一键授权
			</view>
		</view>
		<u-picker mode="selector" v-model="show" :default-selector="[0]" :range="selector"></u-picker>
		<u-picker mode="selector" @confirm="confirmminzu" v-model="showw" :default-selector="[0]" :range="minzulist"></u-picker>
		<u-popup v-model="showpop" mode="center" border-radius="5" width="80%"  >
					<view class="tiship">
						<view class="titlep">
							微信授权
						</view>
						<view class="hosimg">
							<image src="../../../static/icons/hos.png" mode=""></image>
						</view>
						<view class="info">
							{{hosname}}
						</view>
						<view class="info">
							申请获取您微信绑定的手机号，用于申请电子健康卡
						</view>
						<view class="footp">
							<button type="default" @click="jujue()">拒绝</button><button  @click="jujue()" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">允许</button>
						</view>
					</view>
				</u-popup>
	</view>
</template>

<script>
	import homeApi from '@/api/home'
	export default {
		data() {
			return {
				show: false,
				showw: false,
				showpop:false,
				value: "男",
				bir: "",
				sex: "",
				ma: "",
				sexlist: [{
						name: '男',
						disabled: false
					},
					{
						name: '女',
						disabled: false
					}

				],
				selector: ["居民身份证"],
				cardtype: "居民身份证",
				name: "",
				cardid: "",
				address: "",
				minzu: "汉族",
				phone: "",
				minzulist: [
					"汉族",
					"壮族",
					"满族",
					"回族",
					"苗族",
					"维吾尔族",
					"土家族",
					"彝族",
					"蒙古族",
					"藏族",
					"布依族",
					"侗族",
					"瑶族",
					"朝鲜族",
					"白族",
					"哈尼族",
					"哈萨克族",
					"黎族",
					"傣族",
					"畲族",
					"傈僳族",
					"仡佬族",
					"东乡族",
					"高山族",
					"拉祜族",
					"水族",
					"佤族",
					"纳西族",
					"羌族",
					"土族",
					"仫佬族",
					"锡伯族",
					"柯尔克孜族",
					"达斡尔族",
					"景颇族",
					"毛南族",
					"撒拉族",
					"布朗族",
					"塔吉克族",
					"阿昌族",
					"普米族",
					"鄂温克族",
					"怒族",
					"京族",
					"基诺族",
					"德昂族",
					"保安族",
					"俄罗斯族",
					"裕固族",
					"乌孜别克族",
					"门巴族",
					"鄂伦春族",
					"独龙族",
					"塔塔尔族",
					"赫哲族",
					"珞巴族"
				],
				photoImg: "",
				wechatCode: "",
				type:"",
				code:"",
				openid:"",
				appid:"",
				hosname:"",
				length:""
			}
		},
		onLoad(option) {
			if (option.wechatCode) {
				this.wechatCode = option.wechatCode
				if(option.type){
					this.type=option.type
					console.log("这会"+this.type)
				}
			}
			this.hosname=uni.getStorageSync("hosname")
			let phone=uni.getStorageSync("phone")
			if(phone){
				this.phone=phone
			}else{
				this.showpop=true
			}
			this.LoginWx()
		},
		methods: {
			shouquan(){
				if(this.type==2){
					uni.navigateTo({
						url: "../bindcard/bindcard?type=2"
					})
				}else{
					uni.navigateTo({
						url: "../bindcard/bindcard"
					})
				}
				
			},
			getuser() {
				// this.openid = uni.getStorageSync("openid")
				homeApi.getuser({
					wechatid: this.openid
				}).then(res => {
					if (res.code == 4000) {
						// this.userlist = res.data
						this.length=res.data.length
					}
			
				})
			},
			getopenid() {
				// this.appid=uni.getStorageSync("appid")
				this.appid = uni.getAccountInfoSync().miniProgram.appId
				homeApi.getopenid({
					code: this.code,
					appid: this.appid
				}).then(res => {
					if (res.code == 4000) {
						this.openid = res.data
						console.log("新鲜出炉的openis"+this.openid)
						uni.setStorageSync("openid", this.openid)
						this.getuser()
						// this.getuser()
			
					}
				})
			},
			LoginWx() {
				let that = this
				uni.login({
					provider: 'weixin',
					success: (res) => {
						console.log(res)
						this.code = res.code
						if (this.code) {
							this.getopenid()
							
						}
					},
				})
			},
			jujue(){
				this.showpop=false
			},
			getPhoneNumber (e) {
				this.showpop=false
			    console.log(e.detail.errMsg)
			    console.log(e.detail.iv)
			    console.log(e.detail.encryptedData)
				let ph = {
				"encryptedData":e.detail.encryptedData,
				"iv":e.detail.iv
				}
				let phone = JSON.stringify(ph)
				homeApi.getphone(phone).then(res=>{
					console.log(res.data)
					let data=JSON.parse(res.data)
					uni.setStorageSync("phone", data.phoneNumber)
					this.phone=data.phoneNumber
				})
			  },
			submit() {
				// 判断手机号是否正确
				let regPhone = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
				// 邮箱正则
				var emailReg = /^[0-9a-zA-Z_.-]+[@][0-9a-zA-Z_.-]+([.][a-zA-Z]+){1,2}$/;
				// 通行证正则
				var idCard = /^[H|M]\d[0-9]{7}$/;
				// 身份证正则
				var levalard = /^[1-9]\d{5}(18|19|20|(3\d))\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
				// 出生证正则
				var birthdayCard = /^[A-Z]{1}\d[0-9]{8}$/;
				//台胞
				var taibao = /^830000[0-9]{12}$/;
				var num = /^[0-9]*$/;
				// ^830000[0-9]{12}
				var msg = "";
				if (this.name == "") {
					msg = "请输入姓名";
					uni.showToast({
						title: msg,
						icon: "none"
					})
				}
				if (this.nation == "") {
					msg = "请选择民族";
					uni.showToast({
						title: msg,
						icon: "none"
					})
				}
				if (this.cardid == "") {
					msg = "请输入证件号";
					uni.showToast({
						title: msg,
						icon: "none"
					})
				}
				if (this.phone == "") {
					msg = "请输入手机号";
					uni.showToast({
						title: msg,
						icon: "none"
					})
				}
				if (!regPhone.test(this.phone)) {
					msg = "请输入正确的手机号";
					uni.showToast({
						title: msg,
						icon: "none"
					})
				}
				if (this.address == "") {
					msg = "请输入地址";
					uni.showToast({
						title: msg,
						icon: "none"
					})
				}
				var idCard = this.cardid;
				idCard = idCard.toUpperCase(); // 转大写
				let len = idCard.length;
				let city = {
					11: "北京",
					12: "天津",
					13: "河北",
					14: "山西",
					15: "内蒙古",
					21: "辽宁",
					22: "吉林",
					23: "黑龙江 ",
					31: "上海",
					32: "江苏",
					33: "浙江",
					34: "安徽",
					35: "福建",
					36: "江西",
					37: "山东",
					41: "河南",
					42: "湖北 ",
					43: "湖南",
					44: "广东",
					45: "广西",
					46: "海南",
					50: "重庆",
					51: "四川",
					52: "贵州",
					53: "云南",
					54: "西藏 ",
					61: "陕西",
					62: "甘肃",
					63: "青海",
					64: "宁夏",
					65: "新疆",
					71: "台湾",
					81: "香港",
					82: "澳门",
					91: "国外"
				};
				//1. 判断长度

				if (len !== 15 && len !== 18) {
					msg = "请输入正确的证件号";
					uni.showToast({
						title: msg,
						icon: "none"
					})
				}
				//2. 身份证号码为15位或者18位，15位时全为数字，18位前17位为数字，最后一位是校验位，可能为数字或字符X。
				if (!/(^\d{15})|(^̲\d{17}([0-9]|X))/.test(idCard)) {
					msg = "请输入正确的证件号";
					uni.showToast({
						title: msg,
						icon: "none"
					})
				}
				//3. 地址码
				if (!city[idCard.substr(0, 2)]) {
					msg = "请输入正确的证件号";
					uni.showToast({
						title: msg,
						icon: "none"
					})
				}

				let re;
				//4. 生日
				if (len === 15) {
					re = new RegExp(/^(\d{6})(\d{2})(\d{2})(\d{2})(\d{3})$/);
					let arrSplit = idCard.match(re);

					//检查生日日期是否正确
					let birth = new Date(
						"19" + arrSplit[2] + "/" + arrSplit[3] + "/" + arrSplit[4]
					);
					let isBirth =
						birth.getYear() === Number(arrSplit[2]) &&
						birth.getMonth() + 1 === Number(arrSplit[3]) &&
						birth.getDate() === Number(arrSplit[4]);
					if (!isBirth) {
						msg = "请输入正确的证件号";
						uni.showToast({
							title: msg,
							icon: "none"
						})
					}
				} else if (len === 18) {
					re = new RegExp(/^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/);
					let arrSplit = idCard.match(re);

					//检查生日日期是否正确
					let birth = new Date(
						arrSplit[2] + "/" + arrSplit[3] + "/" + arrSplit[4]
					);
					let isBirth =
						birth.getFullYear() === Number(arrSplit[2]) &&
						birth.getMonth() + 1 === Number(arrSplit[3]) &&
						birth.getDate() === Number(arrSplit[4]) &&
						birth.getTime() < new Date().getTime();
					if (!isBirth) {
						console.log("1");
					} else {
						//检验18位身份证的校验码是否正确。
						//校验位按照ISO 7064:1983.MOD 11-2的规定生成，X可以认为是数字10。
						let valnum;
						let arrInt = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
						let arrCh = ["1", "0", "X", "9", "8", "7", "6", "5", "4", "3", "2"];
						let nTemp = 0,
							i;
						for (i = 0; i < 17; i++) {
							nTemp += idCard.substr(i, 1) * arrInt[i];
						}
						valnum = arrCh[nTemp % 11];
						if (valnum !== idCard.substr(17, 1)) {
							msg = "请输入正确的证件号";
							uni.showToast({
								title: msg,
								icon: "none"
							})
						}
					}
				}

				if (msg == "") {
					if(this.length==5){
						uni.showToast({
							title:"最多添加五张电子健康卡",
							icon:"none"
						})
					}else{
						let wechatid = uni.getStorageSync("openid")
						let data = {
							wechatCode: this.wechatCode,
							name: this.name,
							// gender:this.sex,
							nation: this.minzu,
							// birthday:this.bir,
							idNumber: this.cardid,
							// idType:"01",
							phone: this.phone,
							address: this.address
						}
						let dataa = JSON.stringify(data)
						homeApi.addpep(dataa).then(res => {
							console.log(res.data);
							if (res.code == 4000) {
								console.log(res)
								if (this.type == 1) {
									// console.log("走后退二步")
									uni.navigateBack({
									    delta: 2
									});
									
								}else if(this.type == 3){
									uni.reLaunch({
										url:"../qianorder/qianorder?healthCardId"+res.data
									})
								}
								else{
								let pages = getCurrentPages(); // 当前页面
								let beforePage = pages[pages.length - 2]; // 前一个页面
								uni.navigateBack({
									success: function() {
										beforePage.onLoad(); // 执行前一个页面的onLoad方法
									},
								});	
								// console.log("走后退一步")
								// uni.navigateBack({
								//     delta: 1
								// });
								}
									
							} else {
								if(res.code=="-10044"){
									uni.showToast({
										title:"系统忙 稍后重试-10044",
										icon:"none"
									})
									}else{
									uni.showToast({
										title:res.msg,
										icon:"none"
									})	
									}
							}
						})
					}
				}
			},
			radioChange(e) {
				this.value = e
			},
			chooseimg() {
				uni.chooseImage({
					sizeType: ['original', 'compressed'],
					sourceType: ['camera', 'album'],
					success: (chooseImageRes) => {
						const tempFilePaths = chooseImageRes.tempFilePaths[0];
						console.log(tempFilePaths)
						let base64 = uni.getFileSystemManager().readFileSync(tempFilePaths, "base64")
						let img = {
							// "wechatCode": this.wechatCode,
							"imageContent": base64 //base64
						}
						let imgg = JSON.stringify(img)
						homeApi.updatecardimg(imgg).then(res=>{
							if(res.code==4000){
								// console.log(res)
								this.name=res.data.name
								this.cardid=res.data.id
								this.minzu=res.data.nation+"族"
								this.address=res.data.address
							}else{
								uni.showToast({
									title:res.msg,
									icon:"none"
								})
							}
						})
						// console.log(base64)
						// uni.uploadFile({
						//             url: 'https://www.example.com/upload', //仅为示例，非真实的接口地址
						//             filePath: tempFilePaths[0],
						//             name: 'file',
						//             formData: {
						//                 'user': 'test'
						//             },
						//             success: (uploadFileRes) => {
						//                 console.log(uploadFileRes.data);
						//             }
						//         });


					}
				});
			},
			check() {
				var idCard = this.cardid
				let _this = this;
				let bbd = ''; // 出生日期
				let sex = ''; // 性别
				let canPass = true;
				idCard = idCard.toUpperCase(); // 转大写
				let len = idCard.length;
				let city = {
					11: "北京",
					12: "天津",
					13: "河北",
					14: "山西",
					15: "内蒙古",
					21: "辽宁",
					22: "吉林",
					23: "黑龙江 ",
					31: "上海",
					32: "江苏",
					33: "浙江",
					34: "安徽",
					35: "福建",
					36: "江西",
					37: "山东",
					41: "河南",
					42: "湖北 ",
					43: "湖南",
					44: "广东",
					45: "广西",
					46: "海南",
					50: "重庆",
					51: "四川",
					52: "贵州",
					53: "云南",
					54: "西藏 ",
					61: "陕西",
					62: "甘肃",
					63: "青海",
					64: "宁夏",
					65: "新疆",
					71: "台湾",
					81: "香港",
					82: "澳门",
					91: "国外"
				};
				//1. 判断长度
				if (len !== 15 && len !== 18) {
					// _this.$toast.error('身份证号长度不正确！');
					uni.showToast({
						title: "请输入正确的身份证号！",
						icon: "none"
					})
					canPass = false;
				}
				//2. 身份证号码为15位或者18位，15位时全为数字，18位前17位为数字，最后一位是校验位，可能为数字或字符X。
				if (!(/(^\d{15})|(^̲\d{17}([0-9]|X))/.test(idCard))) {

					uni.showToast({
						title: "请输入正确的身份证号",
						icon: "none"
					})
					canPass = false;
				}
				//3. 地址码
				if (!city[idCard.substr(0, 2)]) {

					uni.showToast({
						title: "请输入正确的身份证号",
						icon: "none"
					})
					canPass = false;
				}

				let re;
				//4. 生日
				if (len === 15) {
					re = new RegExp(/^(\d{6})(\d{2})(\d{2})(\d{2})(\d{3})$/);
					let arrSplit = idCard.match(re);

					//检查生日日期是否正确
					let birth = new Date('19' + arrSplit[2] + '/' + arrSplit[3] + '/' + arrSplit[4]);
					let isBirth = (birth.getYear() === Number(arrSplit[2])) && ((birth.getMonth() + 1) === Number(arrSplit[3])) && (
						birth.getDate() === Number(arrSplit[4]));
					if (!isBirth) {
						uni.showToast({
							title: "请输入正确的身份证号",
							icon: "none"
						})

						canPass = false;
					}
					bbd = birth;
				} else if (len === 18) {
					re = new RegExp(/^(\d{6})(\d{4})(\d{2})(\d{2})(\d{3})([0-9]|X)$/);
					let arrSplit = idCard.match(re);

					//检查生日日期是否正确
					let birth = new Date(arrSplit[2] + "/" + arrSplit[3] + "/" + arrSplit[4]);
					let isBirth = (birth.getFullYear() === Number(arrSplit[2])) && ((birth.getMonth() + 1) === Number(arrSplit[3])) &&
						(birth.getDate() === Number(arrSplit[4]) && (birth.getTime() < new Date().getTime()));
					if (!isBirth) {


						canPass = false;
					} else {
						//检验18位身份证的校验码是否正确。
						//校验位按照ISO 7064:1983.MOD 11-2的规定生成，X可以认为是数字10。
						let valnum;
						let arrInt = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
						let arrCh = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2'];
						let nTemp = 0,
							i;
						for (i = 0; i < 17; i++) {
							nTemp += idCard.substr(i, 1) * arrInt[i];
						}
						valnum = arrCh[nTemp % 11];
						if (valnum !== idCard.substr(17, 1)) {
							// uni.showToast({
							// 	title: "身份证号校验码不正确！",
							// 	icon: "none"
							// })

							canPass = false;
						}
					}
					bbd = birth;
				}
				// 如果身份验证通过，计算出生年月，性别
				if (canPass == true) {
					bbd = bbd.getFullYear() + '-' + Number(bbd.getMonth() + 1) + '-' + bbd.getDate();
					let arr_fix = bbd.split('-');
					if (arr_fix[1].length == 1) {
						arr_fix[1] = '0' + arr_fix[1];
					}
					if (arr_fix[2].length == 1) {
						arr_fix[2] = '0' + arr_fix[2];
					}
					bbd = arr_fix[0] + '-' + arr_fix[1] + '-' + arr_fix[2];
					// bbd = arr_fix[0] + '-' + arr_fix[1];
					this.bir = bbd
					if (idCard.length == 18) {
						sex = idCard.charAt(idCard.length - 2)
					} else {
						sex = idCard.charAt(idCard.length - 1)
					}
					if (sex % 2 == 1) {
						sex = '男';
						this.sex = "男"
					} else {
						sex = '女';
						this.sex = "女"
					}

				}

				// // canPass true时位验证通过，false时位验证失败
				// return {
				//     canPass: canPass,
				//     birthday: bbd,  // 返回生日
				//     sex: sex    // 返回性别
				// };

			},
			choosercardtype() {
				this.show = true
			},
			chooseminzutype() {
				this.showw = true
			},
			confirmminzu(val) {
				let index = val[0]
				let minzu = this.minzulist.find((el) => this.minzulist.indexOf(el) == index)
				this.minzu = minzu
			}
		}
	}
</script>

<style lang="scss" scoped>
	.addcard {
		width: 100%;
		height: 100vh;
		background-color: #F6F6F6;
      .tiship{
		  width: 100%;
		  .titlep{
			  width: 100%;
			  font-size: 38rpx;
			  text-align: center;
			  // font-weight: bold;
			  line-height: 80rpx;
			  color: #333;
			  // padding-top: 20rpx;
			  border-bottom: 1rpx solid #ccc;
		  }
		  .hosimg{
			  width: 80rpx;
			  height: 80rpx;
			  margin: 0 auto;
			  margin-top: 20rpx;
			  image{
				  width: 100%;
				  height: 100%;
			  }
		  }
		  .info{
			  width: 90%;
			  margin: 0 auto;
			  font-size: 32rpx;
			  text-align: center;
			  line-height: 40rpx;
			  color: #333;
			  margin-top: 10rpx;
		  }
		  .footp{
			  width: 100%;
			  display: flex;
			  margin-top: 20rpx;
			  // padding-bottom: 20rpx;
			  justify-content: space-between;
			  button{
				  font-size: 34rpx;
				  width:50%;
				  height: 80rpx;
				  line-height: 90rpx;
			
			border: none;
			background-color: transparent;
			outline: none; 
				  background-color: #fff;
				  
			  }
// 			  button::after {
//   border: none;
// }
			  button:nth-child(2n){
				  // background-color: #3669F8;
				  color: #1bba1c;
			  }
		  }
	  }
		.foot {
			width: 100%;
			height: 100rpx;
			background-color: #fff;
			position: fixed;
			display: flex;
			bottom: 0;

			.btn {
				width: 350rpx;
				height: 90rpx;
				background: #3669F8;
				margin: 0 auto;
				margin-top: 5rpx;
				border-radius: 90rpx;
				font-size: 38rpx;
				text-align: center;
				line-height: 90rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #FFFFFF;
			}
			.shouquan{
				width: 350rpx;
				height: 90rpx;
				background: #3669F8;
				margin: 0 auto;
				margin-top: 5rpx;
				border-radius: 90rpx;
				font-size: 38rpx;
				text-align: center;
				line-height: 90rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #FFFFFF;
			}
		}

		.head {
			width: 95%;
			margin: 0 auto;
			height: 120rpx;
			background-color: #F6F6F6;
			display: flex;
			justify-content: space-between;

			.headl {
				line-height: 120rpx;
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #000000;

				span {
					color: #3669F8;
				}
			}

			.headr {
				width: 153rpx;
				height: 60rpx;
				margin-top: 30rpx;
				background: #E5F1FF;
				border: 1rpx solid #3669F8;
				border-radius: 27rpx;
				position: relative;

				.icon {
					width: 40rpx;
					height: 40rpx;
					position: absolute;
					top: 10rpx;
					left: 15rpx;
					background: #3669F8;
					border-radius: 50%;

					image {
						width: 20rpx;
						height: 20rpx;
						margin-left: 10rpx;
						margin-top: 10rpx;
					}
				}

				.title {
					font-size: 24rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #3669F8;
					position: absolute;
					right: 15rpx;
					top: 12rpx;
				}
			}
		}

		.form {
			width: 100%;
			background-color: #fff;

			.name {
				width: 95%;
				margin: 0 auto;
				height: 100rpx;
				border-bottom: 1rpx solid #999999;
				display: flex;

				.namel {
					width: 120rpx;
					font-size: 30rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #333333;
					line-height: 100rpx;
				}

				.namer {
					margin-left: 20rpx;

					input {
						height: 100rpx;
						font-size: 30rpx;
					}
				}
			}

			.cardtype {
				width: 95%;
				margin: 0 auto;
				height: 100rpx;
				border-bottom: 1rpx solid #999999;
				display: flex;

				.cardtypel {
					width: 120rpx;
					font-size: 30rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #333333;
					line-height: 100rpx;
				}

				.cardtyper {
					margin-left: 20rpx;
					line-height: 100rpx;
					font-size: 30rpx;

					input {
						height: 100rpx;
						font-size: 30rpx;
					}
				}
			}

			.formtitle {
				width: 95%;
				margin: 0 auto;
				height: 100rpx;
				border-bottom: 1rpx solid #999999;
				display: flex;

				.line {
					width: 10rpx;
					height: 25rpx;
					background: #3669F8;
					border-radius: 5rpx;
					margin-top: 40rpx;
				}

				.info {
					font-size: 32rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #000000;
					margin-left: 20rpx;
					line-height: 100rpx;
				}
			}
		}
	}
</style>
